<template>
    <div class="container-404">
        <span class="error-text text-position">
            404
        </span>
        <span class="notice-text text-position">
            你：∑(っ°Д°;)っ握草(一种植物)？不见了！<br>
            作者：(๑╹◡╹)ﾉ...找不到页面怪我咯？？？
        </span>
    </div>
</template>

<script>
export default {
    name:"404",
    data(){
        return {

        }
    },
    mounted(){

    },
    methods: {
        goBack() {
            this.$router.go(-1);
        },
        goHome() {
            this.$router.push({ path: "/home" });
        }
    }
}

</script>

<style scoped>
    *,
    *:after,
    *:before {
        box-sizing: border-box;
        font-family: "Microsoft Yahei",serif;
    }

    body {
        padding: 0;
        margin: 0;
    }

    .container-404 {
        top: 0;
        left: 0;
        width: 100%;
        height:100%;
        position: fixed;
        max-width: 100%;
        background-size: cover;
        background: url("./../../../../assets/img/error-bg.jpeg") no-repeat center -320px;
    }

    .error-text {
        font-size: 200px;
        color: transparent;
        font-family: Merienda,serif;
        text-shadow: -20px 0 12px #333;
        -webkit-text-stroke: 2px white;
        transform: translate(-50%, -50%);
    }
    .text-position {
        top: 30%;
        left: 60%;
        position: absolute;
    }

    .notice-text {
        color: white;
        font-size: 25px;
        margin-top: 150px;
        font-family: Merienda,serif;
        text-shadow: -10px -1px 3px #333;
        transform: translate(-38%, -50%);
    }

</style>
